<template>
	<view>
		<uni-section title="考试信息" type="line">
			<uni-list>
				<uni-list-item :title="examNameTitle" />
				<uni-list-item :title="examDateTitle" />
			</uni-list>
		</uni-section>
		<uni-section title="专业成绩" type="line" v-if="Object.keys(examDetailsList.majorCourses).length > 0">
			<uni-card v-for="(courseDetailsList, courseName) in examDetailsList.majorCourses" :key="courseName" :title="courseName" padding="0" spacing="0">
				<uni-list>
					<uni-list-item v-for="(item,index) in courseDetailsList" :key="index">
						<template v-slot:body>
							<view class="slot-box">
								<text class="slot-text">{{item.examType}}</text>
								<text class="slot-text" style="color: red;" v-if="item.missExam !== false">缺考</text>
								<text class="slot-text" v-if="item.missExam === false">{{item.score}}分</text>
								<text v-if="item.score >= item.excellentScore" class="slot-text" style="color: seagreen;" >优秀</text>
								<text v-else-if="item.score >= item.goodScore" class="slot-text" style="color: royalblue;" >良好</text>
								<text v-else-if="item.score >= item.passScore" class="slot-text" style="color: orange;">及格</text>
								<text v-else class="slot-text" style="color: red;">不及格</text>
							</view>
						</template>
					</uni-list-item>
				</uni-list>
			</uni-card>
		</uni-section>
		<!-- <uni-section title="公课成绩" type="line" v-if="Object.keys(examDetailsList.publicCourses).length > 0">
			<uni-card v-for="(courseDetailsList, courseName) in examDetailsList.publicCourses" :key="courseName" :title="courseName" padding="0" spacing="0">
				<uni-list>
					<uni-list-item v-for="(item,index) in courseDetailsList" :key="index">
						<template v-slot:body>
							<view class="slot-box">
								<text class="slot-text">{{item.examType}}</text>
								<text class="slot-text" style="color: red;" v-if="item.missExam !== false">缺考</text>
								<text class="slot-text" v-if="item.missExam === false">{{item.score}}分</text>
								<text v-if="item.score >= item.excellentScore" class="slot-text" style="color: seagreen;" >优秀</text>
								<text v-else-if="item.score >= item.goodScore" class="slot-text" style="color: royalblue;" >良好</text>
								<text v-else-if="item.score >= item.passScore" class="slot-text" style="color: orange;">及格</text>
								<text v-else class="slot-text" style="color: red;">不及格</text>
							</view>
						</template>
					</uni-list-item>
				</uni-list>
			</uni-card>
		</uni-section> -->
	</view>
</template>

<script>
	import exam from '@/api/modules/exam';
	
	export default {
		data() {
			return {
				// 考试信息详情数据
				examDetailsList: {
					examName: '',        // 考试名称
					examDate: '',       // 考试时间
					majorCourses: {},    // 专业课程列表
					publicCourses: {},   // 公共课程列表
				},
				studentId : uni.getStorageSync("loginId"),
			}
		},
		onLoad(options) {
			const examId = options.examId;
			const requestExamDetail = () => {
				return exam.getExamDetail(examId, this.studentId);
			};
			 
			requestExamDetail().then(res => {
				if (res && res.data && res.data.length > 0) {
					const { examName, examDate } = res.data[0];
					this.examDetailsList.examName = examName;
					this.examDetailsList.examDate = examDate;
					
					res.data.forEach(item => {
						const courseName = item.courseName;
						const courseType = item.courseType;
						let courseList; 

						if (courseType === '2') {
							courseList = this.examDetailsList.majorCourses[courseName] || [];
						} else if(courseType === '1'){ 
							courseList = this.examDetailsList.publicCourses[courseName] || [];
						}

						const courseDetails = {
							examType: item.examType,
							missExam: item.missExam,
							missExamDesc: item.missExamDesc,
							score: item.score,
							excellentScore: item.excellentScore,
							goodScore: item.goodScore,
							passScore: item.passScore
						};

						courseList.push(courseDetails);

						if (courseType === '2') {
							this.examDetailsList.majorCourses[courseName] = courseList;
						} else if(courseType === '1') {
							this.examDetailsList.publicCourses[courseName] = courseList;
						}
					});
				} 
				console.log(this.examDetailsList);
			}).catch(error => {
				console.error('error:', error);
			});
		},
		computed: {
			examNameTitle() {
				return `考试名称: ${this.examDetailsList.examName}`;
			},
			examDateTitle() {
				return `考试时间: ${this.examDetailsList.examDate === null ? '' : this.examDetailsList.examDate}`;
			}
		},
	}
</script>

<style scoped>
.slot-box {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	align-items: center;
	width: 100%;
}
.slot-text {
	flex: 1;
	font-size: 14px;
}
</style>
